<template>
<div>
    <el-form
    :model="form"
   
    ref="form"
    label-width="100px"
    class="demo-form"
    stripe border style="width: 98%"
  >
    <p align="left" style="color: black; font-size: 20px">基本信息</p>
    <fieldset>
      <el-row>
        <el-col :span="10">
          <el-form-item label="编号">
            <el-input v-model="form.customer_number" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="客户简称">
            <el-input v-model="form.customer_for_short"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="10">
          <el-form-item label="客户名称">
            <el-input v-model="form.customer_client_name"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="公司地址">
            <el-input
              v-model="form.customer_company_address"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="10">
          <el-form-item label="邮政编码">
            <el-input v-model="form.customer_postal_code"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="联系人">
            <el-input v-model="form.customer_linkman"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="10">
          <el-form-item label="公司电话">
            <el-input v-model="form.customer_company_tel"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="传真号">
            <el-input v-model="form.customer_fax_number"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </fieldset>

    <p align="left" style="color: black; font-size: 20px">甲方负责人</p>
    
    <fieldset>
      <el-table :data="tableData" stripe border style="width: 98%">
        <el-table-column
          prop="first_party_number"
          label="序号"
          width="180"
        ></el-table-column>
        <el-table-column
          prop="first_party_name"
          label="姓名"
          width="180"
        ></el-table-column>
        <el-table-column prop="first_party_duty" label="职务">
        </el-table-column>
        <el-table-column prop="first_party_department" label="部门">
        </el-table-column>
        <el-table-column prop="first_party_tell" label="电话">
        </el-table-column>
        <el-table-column prop="first_party_email" label="Email">
        </el-table-column>
        <el-table-column prop="first_party_remark" label="备注">
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-link @click="FanFirst(scope.row.first_party_id)" type="primary">编辑</el-link>
          </template>
        </el-table-column>
      </el-table>
    </fieldset>

    
<el-dialog title="甲方信息查看" :visible.sync="FirstCha" width="30%">
      <span slot="footer" class="dialog-footer">
        <el-form label-width="80px">
          <el-row>
            <el-col :span="10">
              <el-form-item label="序号">
                <el-input v-model="FanFirstInfo.first_party_number" disabled></el-input>
                
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="姓名">
                <el-input v-model="FanFirstInfo.first_party_name"></el-input>
                
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="10">
              <el-form-item label="职务">
                <el-input v-model="FanFirstInfo.first_party_duty"></el-input>
                
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="电话">
                <el-input v-model="FanFirstInfo.first_party_tell"></el-input>
                
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="10">
              <el-form-item label="部门">
                <el-input v-model="FanFirstInfo.first_party_department"></el-input>
                
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="商务电话">
                <el-input v-model="FanFirstInfo.first_party_business_calls"></el-input>
                
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="10">
              <el-form-item label="住宅电话">
                 <el-input v-model="FanFirstInfo.first_party_homephone"></el-input>
                
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="10">
              <el-form-item label="商务传真">
                  <el-input v-model="FanFirstInfo.first_party_business_fax"></el-input>
                
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="住宅传真">
                <el-input v-model="FanFirstInfo.first_party_homefax"></el-input>
                
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="10">
              <el-form-item label="Emial">
                <el-input v-model="FanFirstInfo.first_party_email"></el-input>
                
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="备注">
                 <el-input v-model="FanFirstInfo.first_party_remark"></el-input>
               
              </el-form-item>
            </el-col>
          </el-row>
          <el-button @click="UpdateFirst">修改</el-button>
        </el-form>
      </span>
    </el-dialog>
     

    <p align="left" style="color: black; font-size: 20px">扩展信息</p>
    <fieldset>
      <el-row>
        <el-col :span="10">
          <el-form-item label="客户英文名">
            <el-input v-model="form.extend_client_english_name"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="是否合作">
            <dictionaryTableSelect
              typeKey="isnohe"
              :fieldValue.sync="customerInfo.c_isnohe"
            ></dictionaryTableSelect>
          </el-form-item>
        </el-col>
      </el-row>

      <!-- //国家省城市 -->
      <el-row>
        <el-col :span="7">
          <el-form-item label="国家">
            <el-select
              v-model="form.state_id"
              placeholder="请选择"
              @change="getprovince(form.state_id)"
            >
              <el-option
                v-for="item in state"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="省份">
            <el-select
              v-model="form.province_id"
              placeholder="请选择"
              @change="getCity(form.province_id)"
            >
              <el-option
                v-for="item in province"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="城市">
            <el-select v-model="form.city_id" placeholder="请选择">
              <el-option
                v-for="item in City"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="7">
          <el-form-item label="客户类型">
           <dictionaryTableSelect
              typeKey="ketype"
              :fieldValue.sync="customerInfo.c_ketype"
            ></dictionaryTableSelect>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="所属行业">
            <dictionaryTableSelect
              typeKey="hangye"
              :fieldValue.sync="customerInfo.c_hangye"
            ></dictionaryTableSelect>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="分支机构">
            <el-input v-model="form.extenf_embranchment"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="7">
          <el-form-item label="Email">
            <el-input v-model="form.extend_email"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="公司主页">
            <el-input v-model="form.extend_homepage_of_a_company"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="关系建立时间">
            <el-input
              type="date"
              v-model="form.extend_relation_time"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="7">
          <el-form-item label="关系部门">
            <el-input v-model="form.extend_relation_department"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="信用级别">
             <dictionaryTableSelect
              typeKey="xin"
              :fieldValue.sync="customerInfo.c_xin"
            ></dictionaryTableSelect>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="亲密度">
            <dictionaryTableSelect
              typeKey="qin"
              :fieldValue.sync="customerInfo.c_qin"
            ></dictionaryTableSelect>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="10">
          <el-form-item label="开户银行名称">
            <el-input v-model="form.extend_bank_name"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="10">
          <el-form-item label="企业代码">
            <el-input v-model="form.enterprise_code"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="10">
          <el-form-item label="开户银行账号">
            <el-input v-model="form.extend_bank_account"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="10">
          <el-form-item label="法定代表">
            <el-input v-model="form.extend_legal_published"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item label="纳税人识别号">
        <el-input v-model="form.extend_taxpayer_registration_number"></el-input>
      </el-form-item>

      <el-form-item label="备注">
        <el-input v-model="form.extend_remark"></el-input>
      </el-form-item>
    </fieldset>

    <p align="left" style="color: black; font-size: 20px">满意度调查</p>
    
    <fieldset>
      <el-table :data="manData" stripe border style="width: 98%">
        <el-table-column
          prop="satisfaction_survey_number"
          label="序号"
          width="180"
        ></el-table-column>
        <el-table-column
          prop="satisfaction_survey_content"
          label="调查内容"
          width="180"
        ></el-table-column>
        <el-table-column prop="satisfaction_name" label="满意度">
        </el-table-column>
        <el-table-column prop="satisfaction_survey_time" label="调查时间">
        </el-table-column>
        <el-table-column prop="satisfaction_type_name" label="调查方式">
        </el-table-column>
        <el-table-column prop="satisfaction_remark" label="备注">
        </el-table-column>
        <el-table-column label="操作">
          
            <template slot-scope="scope">
           <el-link @click="ManCha(scope.row.satisfaction_survey_id)" type="primary">查看</el-link>
          </template> 
          
        </el-table-column>
      </el-table>
    </fieldset>

    
<el-dialog title="满意度查看" :visible.sync="fanmanshow" width="30%">
      <span slot="footer" class="dialog-footer">
        <el-form>
          <el-form-item label="序号">
            <el-input v-model="FanmanInfo.satisfaction_survey_number" disabled></el-input>
          </el-form-item>
          <el-form-item label="调查内容">
            <el-input v-model="FanmanInfo.satisfaction_survey_content"></el-input>
            
          </el-form-item>
          <el-form-item label="调查时间">
            <el-input type="date" v-model="FanmanInfo.satisfaction_survey_time"></el-input>
           
          </el-form-item>
          <el-form-item label="满意度">
              <dictionaryTableSelect
             v-model="manInfo.satisfaction_id"
              typeKey="man"
              :fieldValue.sync="customerInfo.c_man"
            ></dictionaryTableSelect>
          </el-form-item>
          <el-form-item label="调查原因">
            <el-input v-model="FanmanInfo.satisfaction_cause"></el-input>
           
          </el-form-item>
          <el-form-item label="调查方式">
          <dictionaryTableSelect
            v-model="manInfo.satisfaction_type_id"
              typeKey="diao"
              :fieldValue.sync="customerInfo.c_diao"
            ></dictionaryTableSelect>
          </el-form-item>
          <el-form-item label="最满意方面">
            <el-input v-model="FanmanInfo.most_satisfying_aspect"></el-input>
            
          </el-form-item>
          <el-form-item label="最不满意方面">
            <el-input v-model="FanmanInfo.most_usatisfying_aspect"></el-input>
            
          </el-form-item>
          <el-form-item label="备注">
            <el-input v-model="FanmanInfo.satisfaction_remark"></el-input>
            
          </el-form-item>
        <el-button type="primary" @click="Updateman">编辑</el-button>
        </el-form>
      </span>
    </el-dialog>
     
     <el-button type="primary" @click="CustomerUpdate">修改</el-button>
    </el-form>
    </div>
</template>

<script>
var lujing = "http://localhost:55117/api/Customer/";
export default {
  data() {
    return {
      form: {},
      FanFirstInfo:{},
      FanmanInfo:{},
      fid:sessionStorage.getItem("fid"),
      jid:sessionStorage.getItem("jid"),
      mid:sessionStorage.getItem("mid"),
      FirstCha:false,
      fanmanshow:false,
      tableData:[],
      state:[],
      province:[],
      manData:[],
      manInfo:{},
      //满意度
      satisfaction:[],
      //调查方式
      survey:[],
      sfid:null,
      City:[],
      //是否合作
      isno:[],
      //亲密度
      intimate:[],
      //信用级别
      credit:[],
      //所属行业
      industry:[],
      //客户类型
      clienttype:[],
       customerInfo: {
        fileList: [],
        c_man: null,
        c_diao:null,
        c_isnohe:null,
        c_ketype:null,
        c_hangye:null,
        c_xin:null,
        c_qin:null,
      },
      
      
    };
  },
  components: {
    dictionaryTableSelect: () =>
      import("@/components/system_manager/DictionaryTableSelect"),
  },
  created() {
      this.getState();
      this.fanCustomer();
      this.fanjia();
      this.fanman();
      this.getprovince();
  },

  methods: {
    onSubmit() {
      console.log("submit!");
    },
    ManCha(id){
        this.fanmanshow=true;
        this.$myaxios.get(lujing+"ManCha?id="+id).then(obj=>{
            this.FanmanInfo=obj.data;
            this.customerInfo.c_man = this.FanmanInfo.satisfaction_id;
            this.customerInfo.c_diao=this.FanmanInfo.satisfaction_type_id;
            
        })
    },
    FanFirst(id) {
      this.FirstCha = true;
      this.$myaxios.get(lujing + "FanFirst?id=" + id).then((obj) => {
        this.FanFirstInfo = obj.data;
        
      });
    },
    fanCustomer(){
        this.$myaxios.get(lujing+"FanCustomer?id="+this.fid).then(obj=>{
            this.form=obj.data;
            this.customerInfo.c_isnohe=this.form.whether_cooperation_id;
            this.customerInfo.c_ketype=this.form.client_id;
            this.customerInfo.c_hangye=this.form.industry_id;
            this.customerInfo.c_xin=this.form.extend_credit_ratings_id;
            this.customerInfo.c_qin=this.form.extend_intimacy_id;
            this.sfid=this.form.province_id;
            console.log(this.form);
            this.getCity();
        })
    },
    fanjia()
    {
        this.$myaxios.get(lujing+"Fanjia?id="+this.jid).then(obj=>{
            this.tableData=obj.data;
        })
    },
    fanman()
    {
        this.$myaxios.get(lujing+"Fanman?id="+this.mid).then(obj=>{
            this.manData=obj.data;
        })
    },
    getState() {
      this.$myaxios.get(lujing + "GetChina?id=0").then((obj) => {
        this.state = obj.data;
      });
    },
    async getprovince(id) {
     
      await this.$myaxios.get(lujing + "GetChina?id=1").then((obj) => {
        this.province = obj.data;
        console.log(this.province);
      });
    },
     Updateman() {
       this.FanmanInfo.satisfaction_id=this.customerInfo.c_man;
       this.FanmanInfo.satisfaction_type_id=this.customerInfo.c_diao
      this.$myaxios.post(lujing + "Updateman", this.FanmanInfo).then((obj) => {
        if (obj.data != null) {
          this.$message("修改成功");
          this.fanmanshow = false;
          this.fanman();
        }
      });
    },
    
     getCity(id) {
        if(id==null)
        {
            id=this.sfid
        }
        if(this.sfid!=null)
        {

        }
        else
        {
                this.form.city_id=null;
        }
        
        
       this.$myaxios.get(lujing + "GetChina?id=" + id).then((obj) => {
        this.City = obj.data;
      });
      this.sfid=null;
    },
    UpdateFirst() {
      this.$myaxios
        .post(lujing + "UpdateFirst", this.FanFirstInfo)
        .then((obj) => {
          if (obj.data != null) {
            this.$message("修改成功");
            this.FirstCha = false;
            this.fanjia();
          }
        });
    },
    CustomerUpdate(){
       this.form.whether_cooperation_id=this.customerInfo.c_isnohe;
      this.form.client_id=this.customerInfo.c_ketype;
      this.form.industry_id=this.customerInfo.c_hangye;
      this.form.extend_credit_ratings_id=this.customerInfo.c_xin;
      this.form.extend_intimacy_id=this.customerInfo.c_qin;
      this.$myaxios.post(lujing+"CustomerUpdate",this.form).then(obj=>{
        if(obj.data!=null)
        {
          this.$message("修改成功");
          this.fanCustomer();
        }
      })
    }
  },
};
</script>